// base color
$blue: #324157;
$light-blue: #3A71A8;
$red: #C03639;
$pink: #E65D6E;
$green: #30B08F;
$tiffany: #4AB7BD;
$yellow: #FEC171;
$panGreen: #30B08F;

:root{    
  --vxe-ui-modal-header-background-color:rgba(64, 158, 255, .2);
  --base-menu-light-background: linear-gradient(135deg, rgba(242, 249, 255, 1) 0%, rgba(240, 240, 251, 1) 33.12%, rgba(218, 230, 251, 1) 63.89%, rgba(207, 225, 253, 1) 100%);
  --base-left-width: 200px;
  --el-text-color-placeholder:rgba(62, 70, 79, 0.6);
  --el-fill-color-blank:rgba(255, 255, 255, 0.8);
  --el-bg-color:rgba(241, 247, 250, 0.96);
  --el-drawer-bg-color:rgba(255, 255, 255, 0.8);
    --vxe-ui-table-header-background-color: rgba(64, 158, 255, .08) !important;
    --vxe-ui-table-row-hover-background-color: rgba(91, 109, 128, 0.02) !important;
    --vxe-ui-table-row-striped-background-color: rgba(91, 109, 128, 0.02) !important;
    --vxe-ui-table-row-hover-striped-background-color: rgba(91, 109, 128, 0.02) !important;
    --vxe-ui-table-row-current-background-color: transparent !important;
    --vxe-ui-table-row-hover-current-background-color: rgba(91, 109, 128, 0.02) !important;
    --vxe-ui-table-fixed-scrolling-box-shadow-color: rgba(0, 0, 0, .12);
    --vxe-ui-table-drag-over-background-color: rgba(255, 255, 200, .3);
    --vxe-ui-table-border-color:rgba(240, 243, 245, .01) !important;
    --vxe-ui-layout-background-color:transparent !important;
    --vxe-ui-table-row-checkbox-checked-background-color:rgba(91, 109, 128, 0.02) !important;
}

// 默认菜单主题风格
$base-menu-color: #bfcbd9;
$base-menu-color-active: #f4f4f5;
$base-menu-background: var(--base-menu-light-background);
$base-logo-title-color: #ffffff;

$base-menu-light-color: rgba(0, 0, 0, 0.7);
$base-menu-light-background: #ffffff;
$base-logo-light-title-color: #001529;

$base-sub-menu-background: var(--base-menu-light-background);
$base-sub-menu-hover: rgba(0, 0, 0, 0.06);

// 自定义暗色菜单风格
/**
$base-menu-color:hsla(0,0%,100%,.65);
$base-menu-color-active:#fff;
$base-menu-background:#001529;
$base-logo-title-color: #ffffff;

$base-menu-light-color:rgba(0,0,0,.70);
$base-menu-light-background:#ffffff;
$base-logo-light-title-color: #001529;

$base-sub-menu-background:#000c17;
$base-sub-menu-hover:#001528;
*/

$--color-primary: #409EFF;
$--color-success: #67C23A;
$--color-warning: #E6A23C;
$--color-danger: #F56C6C;
$--color-info: #909399;

$base-sidebar-width: var(--base-left-width);

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuColor: $base-menu-color;
  menuLightColor: $base-menu-light-color;
  menuColorActive: $base-menu-color-active;
  menuBackground: $base-menu-background;
  menuLightBackground: $base-menu-light-background;
  subMenuBackground: $base-sub-menu-background;
  subMenuHover: $base-sub-menu-hover;
  sideBarWidth: $base-sidebar-width;
  logoTitleColor: $base-logo-title-color;
  logoLightTitleColor: $base-logo-light-title-color;
  primaryColor: $--color-primary;
  successColor: $--color-success;
  dangerColor: $--color-danger;
  infoColor: $--color-info;
  warningColor: $--color-warning;
}
.el-table{
  --el-bg-color:transparent !important;
  --el-table-bg-color:transparent !important;
}
.vxe-modal--wrapper .vxe-modal--box{
    background-color: rgba(241, 247, 250, 0.96);
}